<template>
    <div :style="{ 'color': color}">{{ time }}</div>
</template>
<script setup>
import { ref, defineProps } from 'vue'
const props = defineProps({
    'total': Number,
    'warn': Number, 
    'c': String
})
const time = ref(props.total)
const color = ref('#000')
const i = setInterval(() => {
    time.value --
    if(time.value <= props.warn) {
        color.value = props.c
    }
    if(time.value <= 0) {
        clearInterval(i)
    }
}, 1000)
</script>
<style scoped>
    
</style>